<template>
	<view class="container">
		<view class="addrBox" style="margin-top: 20rpx;">
			<view class="cityBox flex-ac">
				<view class="hd" @click="show2 = true">
					<input type="text" v-model="form.districtName" disabled placeholder="选择省市区" placeholder-style="color: #cccccc;" />
				</view>
				<image src="../../../../static/img/yjt.png" class="more" mode=""></image>
				<view class="line"></view>
				<view class="dzb flexmid-col" @click="show = true">
					<image src="../../../../static/img/dzb.png" mode=""></image>
					<view class="text">地址薄</view>
				</view>
			</view>
			<view class="areaBox">
				<view class="selBtn flexmid" v-if="form.detailLocation == ''" @click="toMap">
					<view>{{type == 1 ? '选择发货地址' : '选择收货地址'}}</view>
					<image src="../../../../static/img/yjt-lv.png" class="more" style="margin-top: 5rpx;" mode=""></image>
				</view>
				<view class="area flex-ac" v-else>
					<view class="area-hd">
						<view class="name">{{addrname}}</view>
						<view class="dz">{{addrdesc}}</view>
					</view>
					<view class="area-bd" @click="toMap">修改地址</view>
				</view>
			</view>
		</view>
		<u-picker mode="region" v-model="show2" @confirm="chooseCity" confirm-color="#3DB020" title="选择省市区"></u-picker>
		
		<view class="peopleBox">
			<view class="tit flex-ac flex-b">
				<view class="hd">联系人信息</view>
				<view class="bd flex-ac">
<!-- 					<image src="../../../../static/img/txl.png" mode=""></image>
					<view>通讯录</view> -->
				</view>
			</view>
			<view class="info flex-ac flex-b">
				<view class="item">
					<input type="text" v-model="form.name" placeholder="请输入联系人姓名" placeholder-style="color: #cccccc;" />
				</view>
				<view class="line"></view>
				<view class="item">
					<input type="number" v-model="form.mobile" maxlength="11" placeholder="请输入电话号码" placeholder-style="color: #cccccc;" />
				</view>
			</view>
		</view>
		
		<view class="foot" style="position: fixed; left: 0; bottom: 0;">
			<view class="btnBox flex-ac">
				<view class="btn-1 middle" @click="sureSel">确定</view>
			</view>
			<x-botSpace></x-botSpace>
		</view>
		
		<!-- 选择地址 -->
		<u-popup v-model="show" mode="bottom" border-radius="14">
			<view class="popupBox">
				<!-- <view class="time-tit">确认接单时间</view> -->
				<view class="tit flex-ac flex-b">
					<view class="hd" @click="show = false">取消</view>
					<view class="md">地址簿</view>
					<view class="bd middle" @click="chooseAddr">确定</view>
				</view>
				<view class="time-body" v-if="show">
					<u-swipe-action :show="item.show" :index="index" v-for="(item, index) in list" :key="item.id" @click="click" @open="open" :options="options" btn-width='120' v-if="list.length > 0">
						<view class="itemBox flex-ac flex-b">
							<image v-if="index === s_index" src='../../../../static/img/iconSeled.png' style="width: 30rpx; height: 30rpx; margin-right: 20rpx; flex-shrink: 0;" mode=""></image>
							<image v-else src='../../../../static/img/iconSel.png' style="width: 30rpx; height: 30rpx; margin-right: 20rpx; flex-shrink: 0;" mode=""></image>
							<view style="flex: 1;" @click="s_index = index">
								<view class="tits flex-ac">{{item.districtName}}</view>
								<view class="desc">{{item.detailLocation}}</view>
								<view class="desc">{{item.projectName}} | {{item.name}} | {{item.mobile}}</view>
							</view>
							<image class="editIcon" src="../../../../static/img/bj.png" mode="" @click="$Jump.Open('/pages/user/address/edit?id=' + item.id)"></image>
						</view>
					</u-swipe-action>
				</view>
			</view>
		</u-popup>
		
	</view>
</template>

<script>
	export default {
		data() {
			return {
				type: 1, // 1发货地  2收货地
				list: [],
				show: false,
				form: {
					detailLocation: "",  // 详细地址【必须】
					districtName: "",  // 所在地区【必须】
					mobile: "",  // 手机号【必须】
					name: "",  // 名称【必须】
					organizationId: "",  // 组织机构id（读取项目的组织机构ID）【必须】
					projectId: "",  // 项目ID【必须】
					projectName: "",  // 项目名称【必须】
					type: "",  // 地址类型 send_address：发货地址，receive_address：收货地址【必须】
				},
				submitform: {},
				options: [{
					text: '删除',
					style: {
						backgroundColor: '#dd524d'
					}
				}],
				s_index: -1,
				show2: false,
				city: '',
				addrname: '',
				addrdesc: '',
				organizationId: ''
			}
		},
		onLoad(opt) {
			if(opt) console.log('opt:', opt)
			this.type = opt.type
			if(opt.organizationId) this.organizationId = opt.organizationId
			if(opt.type == 1){
				uni.setNavigationBarTitle({
					title: '发货地址'
				})
				this.getAddressList('send_address')
			}else{
				uni.setNavigationBarTitle({
					title: '收货地址'
				})
				this.getAddressList('receive_address')
			}
		},
		methods: {
			//获取地址列表 /consignorApi/addressManage/page
			getAddressList(type){
				this.$Net.get('/consignorApi/addressManage/pageBySelect',{
					type: type,
					pageSize: 9999,
					organizationId: this.organizationId
				}).then(res=>{
					console.log('地址列表:', res)
					if(res.data.rows.length > 0){
						res.data.rows.map(el=>{
							el.show = false
						})
					}
					this.list = res.data.rows
				})
			},
			chooseAddr(){
				if(this.s_index === -1) return this.show = false
				this.form.districtName = this.list[this.s_index].districtName
				this.form.detailLocation = this.list[this.s_index].detailLocation
				this.addrdesc = this.list[this.s_index].detailLocation
				this.form.mobile = this.list[this.s_index].mobile
				this.form.name = this.list[this.s_index].name
				this.s_index = -1
				this.show = false
			},
			toMap(){
				if(this.form.districtName === '') return this.$Toast.message('清先选择省市区')
				this.$Jump.Open('../map/map?city=' + this.city)
			},
			chooseCity(e){
				console.log(e)
				this.form.districtName = e.province.label + '/' + e.city.label + '/' + e.area.label
				if(e.province.label.indexOf('市') != -1){
					this.city = e.province.label
				}else if(e.city.label.indexOf('市') != -1){
					this.city = e.city.label
				}
			},
			
			sureSel(){
				let pages = getCurrentPages()
				let prevPage = pages[pages.length - 2]
				if(this.type == 1){
					this.submitform.senderName = this.form.name
					this.submitform.senderMobile = this.form.mobile
					this.submitform.senderDistrictName = this.form.districtName
					this.submitform.senderDetailLocation = this.form.detailLocation
				}else{
					this.submitform.receiverName = this.form.name
					this.submitform.receiverMobile = this.form.mobile
					this.submitform.receiverDistrictName = this.form.districtName
					this.submitform.receiverDetailLocation = this.form.detailLocation
				}
				prevPage.$vm.form = Object.assign(prevPage.$vm.form, this.submitform) 
				this.$Jump.Back(1)
			},
			
			click(index, index1) {
				// console.log('index:', index)
				// console.log('index1:', index1)
				uni.showModal({
					content: '确定要删除吗',
					success: (res) => {
						if(res.confirm){
							this.$Net.post('/consignorApi/addressManage/delete',{
								id: this.list[index].id
							}).then(res=>{
								this.list.splice(index, 1);
								this.$Toast.messageIcon('操作成功')
							})
						}
					}
				})
				// this.$u.toast(`删除了第${index}个cell`);
			},
			// 如果打开一个的时候，不需要关闭其他，则无需实现本方法
			open(index) {
				// 先将正在被操作的swipeAction标记为打开状态，否则由于props的特性限制，
				// 原本为'false'，再次设置为'false'会无效
				this.list[index].show = true;
				this.list.map((val, idx) => {
					if (index != idx) this.list[idx].show = false;
				})
			}
		}
	}
</script>

<style lang="scss">
	page{ background-color: #f9f9f9; }
</style>

<style lang="scss" scoped>
	@import './selAddr.scss';
</style>
